<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Chat with OpenAI</title>
  <!-- 引入Bootstrap样式表 -->
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
  <link href="../css/mycss.css" rel="stylesheet" type="text/css">
</head>

<body>
<nav class="navbar navbar-dark bg-dark fixed-top">
  <div class="container">
    <a class="navbar-brand" href="#">Chat with OpenAI</a>
  </div>
</nav>
<div class="container mt-4">
  <form id="chatForm">
    <div class="mb-3">
      <label for="message" class="form-label" style="font-family: 'Arial', sans-serif; font-size: 16px">请输入你的问题:</label>
      <input type="text" class="form-control" id="message" name="message" placeholder="快来提问吧！">
    </div>
    <button type="submit" class="btn btn-primary me-2 btn-green">发送</button>
    <button class="btn btn-danger btn-red" onclick="clearHistory()">清空历史记录</button>
  </form>
  <hr>
  <div class="chat-container" id="chatHistory"></div>
</div>
<script src="../js/myScripts.js"></script>
</body>

</html>





